<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="java.util.*" %>
<%@ page import="managesystem.Student" %>
<%@ page import="controlsystem.StatisticsController" %>
<%@ page import="controlsystem.Course" %>
<%@ page import="managesystem.Buddy" %>

<html>
  <head>
  
  <script type="text/javascript" src="https://www.google.com/jsapi"></script>
  <script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>

 	<%
 	 		Student currStud = (Student) session.getAttribute("currStud");
 	%>
 	
 	<script type='text/javascript'>
    var divNumber;
	var selectedGraph;
	
	$(function() {
		<!-- bij het veranderen van de selector van type grafiek een andere form tonen -->
    	$('.selectType').change(function() {
    		
    		hideAll(divNumber); 
    		var x = $(this).val();
    		selectedGraph = x;
    		if(x==1){ //pagina's per vak
    		$("#formTimePerCourse"+divNumber).show(0);
    		}
    		if(x==2){ //Time vs Ideal
        	$("#formTimevsIdeal"+divNumber).show(0); 
    		} 
/*     		if(x==3){ //TopBuddies
            $("#formTopBuddies"+divNumber).show(0); 
        	} 
    		if(x==4){ //TopPlaces
            $("#formTopPlaces"+divNumber).show(0); 
            }  */
    		if(x==5){ //CourseDistribution
            $("#formCourseDist"+divNumber).show(0); 
            } 
            if(x==6){ //gemiddelde rating
            $("#formAvgRating"+divNumber).show(0); 
            } 
            if(x==7){ //dayofweek
            $("#formDayOfWeek"+divNumber).show(0); 
            } 
            if(x==8){ //verdeling school/other
            $("#formSchoolOther"+divNumber).show(0); 
            } 
            if(x==9){ //verdeling other
            $("#formOther"+divNumber).show(0); 
            } 
            if(x==10){ //avg time vs your
            $("#avgTimePerCourse"+divNumber).show(0); 
            } 

    	}
      	);
	});
	
   


<!-- Het veranderen van de titel bij updaten van grafiek-->
function updateTitle(titleNumber, course) {
		if(selectedGraph==1){ //pagina's per vak
		document.getElementById('title'+titleNumber).innerHTML = 'Hours per Course';
		}
		if(selectedGraph==2){ //Time vs Ideal
		var checkedItemsArray = course.split("tvid");
    	document.getElementById('title'+titleNumber).innerHTML = 'Time vs Ideal: '+checkedItemsArray[1];
		} 
/* 		if(selectedGraph==3){ //Top buddies
    	document.getElementById('title'+titleNumber).innerHTML = 'Top Buddies';
    	}
		if(selectedGraph==4){ //Top places
       	document.getElementById('title'+titleNumber).innerHTML = 'Top Places';
        } */
		if(selectedGraph==5){ //CourseDistribution
		var checkedItemsArray = course.split("coDi");
        document.getElementById('title'+titleNumber).innerHTML = 'Course Type Distribution: '+checkedItemsArray[1];
        }
		if(selectedGraph==6){ //gemiddelde rating
        document.getElementById('title'+titleNumber).innerHTML = 'Average rating';
        }
		if(selectedGraph==7){ //dayofweek
        document.getElementById('title'+titleNumber).innerHTML = 'Days of the week';
        }
		if(selectedGraph==8){ //schoolotheract
        document.getElementById('title'+titleNumber).innerHTML = 'School/other activities';
        }
		if(selectedGraph==9){ //otheract
        document.getElementById('title'+titleNumber).innerHTML = 'Other activities';
        }
		if(selectedGraph==10){ //AvgPerCourse
	    document.getElementById('title'+titleNumber).innerHTML = 'Average time per course';
	    }
}

	<!-- getriggerd als er op het radje gedrukt wordt -->
		function show_settings(k) {
			divNumber = k;
			$("#fullSettingsbox"+k).toggle();	
			hideAll(k);
			$("#selectType").val(0);
		}

		function hide_settings(k) {
			divNumber = k;
			$("#fullSettingsbox"+k).hide();	
			hideAll(k);
		}	
	</script>

  <script type="text/javascript">
    
   google.load("visualization", "1", {packages:["corechart", 'table']});
 
      google.setOnLoadCallback(function(){
    	  hideAll(1); 
    	  hideAll(2); 
    	  $("#fullSettingsbox1").hide();
    	  $("#fullSettingsbox2").hide();
    	  $("#fullSettingsbox3").hide();
    	  $("#fullSettingsbox4").hide();
    	  
    	  initChart();
    	  initPremadeHash(); 
    	  fillData();                                                         
    	  drawChart();                                                                                    
    	}) 
      

      <!-- eerste keer (onLoad) plot tekenen -->	
    function initChart() {
  	  
  	  data = new google.visualization.DataTable();
  	  data.addColumn('string', 'Course');
        data.addColumn('number', 'Hours');

    }
	
	
    <!-- eerste keer (onLoad) plot tekenen -->
    function initPremadeHash(){          
  	  <%HashMap<Course,Double> hoursPerCourse = StatisticsController.getTimePerCourse(currStud);%>
    } 	

    <!-- eerste keer (onLoad) plot tekenen -->
    function fillData(){    	  
  	  <%Iterator it = hoursPerCourse.entrySet().iterator();
  	  int i = 0;
  	  while (it.hasNext()) {
  		  Map.Entry pairs = (Map.Entry)it.next();%> 
  	  data.addRow();
  	  var courseName = "<%=((Course)pairs.getKey()).getName()%>"
  	  var numberHours = (<%=pairs.getValue()%>);	
  	  data.setCell( <%=i%> , 0, courseName);
  	  data.setCell( <%=i%> , 1, numberHours);
             
  	  <%
  	  i++;
  	  }
  	  %>
    }
	
    <!-- eerste keer (onLoad) plot tekenen -->
	  function drawChart(){
	  chart = new google.visualization.PieChart(document.getElementById('chart_div'));
	  chart.draw(data, 
	  {
		  width: 350, height: 280,
		  colors:['#39869b','#46a1b9','#7cbbcf','#b5d4e0'],
		  wmode: 'flash'
	  });
	  chart = new google.visualization.BarChart(document.getElementById('chart_div2'));
	  chart.draw(data, 
	  {
		  width: 350, height: 280,
		  colors:['#39869b','#46a1b9','#7cbbcf','#b5d4e0'],
		  wmode: 'flash'
	  });
	  chart = new google.visualization.Table(document.getElementById('chart_div3'));
	  chart.draw(data, 
	  {
		  width: 350, height: 280,
		  colors:['#39869b','#46a1b9','#7cbbcf','#b5d4e0'],
		  wmode: 'flash'
	  });
	  chart = new google.visualization.PieChart(document.getElementById('chart_div4'));
	  chart.draw(data, 
	  {
		  width: 350, height: 280,
		  colors:['#39869b','#46a1b9','#7cbbcf','#b5d4e0'],
		  wmode: 'flash'
	  });
    }    

      

	  
	  
	  <!-- teken plot afhankelijk van soort (pie/table/bar) -->
	  function UpdateChart (typeOfChart, dive) {
		 
		  if(typeOfChart=="0"){
			  chart = new google.visualization.PieChart(document.getElementById(dive));
		  }
		  else if(typeOfChart=="1"){ 
			  chart = new google.visualization.BarChart(document.getElementById(dive));
		  }
		  else if(typeOfChart=="2"){ 
			  chart = new google.visualization.Table(document.getElementById(dive));
		  }
		  chart.draw(data, {width: 350, height: 280,colors:['#39869b','#46a1b9','#7cbbcf','#b5d4e0']});
		    
	  }
	  
		  
	 
	  
	
	  
	
	
	 	   
    
    function updateChartAvgRating(form, dive, k){ 
		
		hide_settings(k); //kaderke verbergen
		
		  data = new google.visualization.DataTable();
    	  data.addColumn('string', 'Course');
          data.addColumn('number', 'Average Rating'); 
          
          <%
		  HashMap<String, Integer> avgRating = StatisticsController.getCourseAverageRating(currStud);
		  %>
          
		  inc=0;    	  
          <%
          Iterator it_avgRating = avgRating.entrySet().iterator();
          while (it_avgRating.hasNext()) {
    	  Map.Entry avgRating_pairs = (Map.Entry)it_avgRating.next();
    	  %> 	  
    	  data.addRow();
    	  data.setCell( inc , 0, '<%=avgRating_pairs.getKey()%>'); 
    	  data.setCell( inc , 1, <%=avgRating_pairs.getValue()%>);
    	  inc++;
    	  <%
          }
          %>
          typeOfChart = form.typeOfChart.value;
		  UpdateChart (typeOfChart, dive); 
		  updateTitle(k,null);
      } 
    
    function updateChartDaysOfWeek(form, dive, k){ 
		
		hide_settings(k); //kaderke verbergen
		
		  data = new google.visualization.DataTable();
    	  data.addColumn('string', 'Day');
          data.addColumn('number', 'Hours'); 
          data.addRows(7);
          
          <%
		  HashMap<String,Double> DaysOfWeek = StatisticsController.getProductiveDay(currStud);
		  %>

    	  data.setCell( 0 , 0, 'Monday'); 
    	  data.setCell( 0 , 1, <%=DaysOfWeek.get("Monday")%>);
    	  data.setCell( 1 , 0, 'Tuesday'); 
    	  data.setCell( 1 , 1, <%=DaysOfWeek.get("Tuesday")%>);
    	  data.setCell( 2 , 0, 'Wednesday'); 
    	  data.setCell( 2 , 1, <%=DaysOfWeek.get("Wednesday")%>);
    	  data.setCell( 3 , 0, 'Thursday'); 
    	  data.setCell( 3 , 1, <%=DaysOfWeek.get("Thursday")%>);
    	  data.setCell( 4 , 0, 'Friday'); 
    	  data.setCell( 4 , 1, <%=DaysOfWeek.get("Friday")%>);
    	  data.setCell( 5 , 0, 'Saturday'); 
    	  data.setCell( 5 , 1, <%=DaysOfWeek.get("Saturday")%>);
    	  data.setCell( 6 , 0, 'Sunday'); 
    	  data.setCell( 6 , 1, <%=DaysOfWeek.get("Sunday")%>);
    	  
          typeOfChart = form.typeOfChart.value;
		  UpdateChart (typeOfChart, dive); 
		  updateTitle(k,null);
      } 
    
    function updateSchoolOther(form, dive, k){ 
		
		hide_settings(k); //kaderke verbergen
		
		  data = new google.visualization.DataTable();
    	  data.addColumn('string', 'School/FreeTime');
          data.addColumn('number', 'Hours'); 

          <%
		  HashMap<String, Double> schoolFree = StatisticsController.schoolFree(currStud);
		  %>
          
		  inc=0;    	  
          <%
          Iterator it_schoolFree = schoolFree.entrySet().iterator();
          while (it_schoolFree.hasNext()) {
    	  Map.Entry schoolFree_pairs = (Map.Entry)it_schoolFree.next();
    	  %> 	  
    	  data.addRow();
    	  data.setCell( inc , 0, '<%=schoolFree_pairs.getKey()%>'); 
    	  data.setCell( inc , 1, <%=schoolFree_pairs.getValue()%>);
    	  inc++;
    	  <%
          }
          %>
          typeOfChart = form.typeOfChart.value;
		  UpdateChart (typeOfChart, dive); 
		  updateTitle(k,null);
      } 
    
	function updateOther(form, dive, k){ 
		
		hide_settings(k); //kaderke verbergen
		  data = new google.visualization.DataTable();
    	  data.addColumn('string', 'Activity');
          data.addColumn('number', 'Number of hours'); 
          
          <%
          HashMap<String, Double> freeDistrib = StatisticsController.getFreeDistribution(currStud);
		  %>
          
		  inc=0;    	  
          <%
          Iterator it_freeDistrib = freeDistrib.entrySet().iterator();
          while (it_freeDistrib.hasNext()) {
    	  Map.Entry freeDistrib_pairs = (Map.Entry)it_freeDistrib.next();
    	  %> 	  
    	  data.addRow();
    	  data.setCell( inc , 0, '<%=freeDistrib_pairs.getKey()%>'); 
    	  data.setCell( inc , 1, <%=freeDistrib_pairs.getValue()%>);
    	  inc++;
    	  <%
          }
          %>
          typeOfChart = form.typeOfChart.value;
		  UpdateChart (typeOfChart, dive); 
		  updateTitle(k,null);
      } 
	
function updateAvgTimePerCourse(form, dive, k){ 
		
		hide_settings(k); //kaderke verbergen
		  data = new google.visualization.DataTable();
    	  data.addColumn('string', 'Course');
          data.addColumn('number', 'Your time (hours)'); 
          data.addColumn('number', 'Average time (hours)');
          <%
          HashMap<Course, Double> avgTimePerCourse = StatisticsController.getAvgTimePerCourse(currStud);
          HashMap<Course, Double> hoursPerCourse2 = StatisticsController.getTimePerCourse(currStud);
		  %>
          
		  inc=0;    	  
          <%
          Iterator it_avgTimePerCourse = avgTimePerCourse.entrySet().iterator();
          while (it_avgTimePerCourse.hasNext()) {
    	  Map.Entry avgTimePerCourse_pairs = (Map.Entry)it_avgTimePerCourse.next();
    	  String courseName = ((Course)avgTimePerCourse_pairs.getKey()).getName();
    	  Course course = ((Course)avgTimePerCourse_pairs.getKey());
    	  double numberOfHo = hoursPerCourse2.get(course);
    	  %> 	
     	  
    	  data.addRow();
    	  data.setCell( inc , 0, '<%=courseName%>'); 
    	  data.setCell( inc , 1, <%=numberOfHo%>);
    	  data.setCell( inc , 2, <%=avgTimePerCourse_pairs.getValue()%>);

    	  inc++;
    	  <%
          }
          %>
          typeOfChart = form.typeOfChart.value;
		  UpdateChart (typeOfChart, dive); 
		  updateTitle(k,null);
      } 
	 	  
    </script>  
    
  </head>

  <body>
  
  <script type='text/javascript'>
  <% 
  HashMap<Course,Double> time = StatisticsController.getTimePerCourse(currStud);
  List<Course> studCourses = currStud.getCourses();
  boolean langeTijd = false;
  for(Course c : studCourses){
	  System.out.println(time.get(c));
	  if (time.get(c)>0.01){
		  langeTijd=true;
	  }  
  }
  if(langeTijd==false){
	  %>
		alert("You don't have enough tracked activities to generate statistics.")
		location.href='/index.jsp?id=dashboard'	  
	  <%   
  }
  
  %>
  </script>    
 
  <div style="position: relative; left: 30px; top: 10px;">			
  <div style="position: relative; left: 10px; top: 10px">
  <% pageContext.include("4plots_incl.jsp?dive=chart_div"); %>
  </div>
  
   <div style="position: relative; left: 380px; top: 10px">
   <% pageContext.include("4plots_incl.jsp?dive=chart_div2"); %>
  </div>
  
  
    <div style="position: relative; left: 10px; top: 340px">
  <% pageContext.include("4plots_incl.jsp?dive=chart_div3"); %>
  </div>
  
  <div style="position: relative; left: 380px; top: 340px">
   <% pageContext.include("4plots_incl.jsp?dive=chart_div4"); %>
  </div>  
  

  </br></br></br></br></br></br></br></br></br>
  </br></br></br></br></br></br></br></br></br>
  </br></br></br></br></br></br></br></br></br>
  </br></br></br></br></br></br></br></br></br>
  </br></br>
  <%--//zeer vuile manier om main te stretchen, zal nog opgelost worden--%>
  <%--//todo: dynamisch aantal data_rowadds; bar-grafs met vaste grootte?; vak in de titel 
  //getbuddies geeft 0 terug
  //getplaces geeft 0 terug
  //getDistribution geeft 0 terug
  //getProductiveDay geeft 0 terug
  // extra graf: other activ--%>
  
  </div>
 
	
  </body>
</html>